<template>
    <div class='transaction  ' style=clear:both>
        <!--头部-->
        <div class='head '>
            <div class="iconfont icon-wode1"></div>
            <div class="classify">
                <span>普通</span>
                <span>信用</span>
                <span>港美</span>
            </div>
            <div class="iconfont icon-sousuo"></div>
        </div>
        <!--内容-->
        <div class='main '>
            <!--头部导航-->
            <div class="headNav">
                <div class="navBox">
                    <div class="iconfont icon-mairu" style='color: #de6233'></div>
                    <p>买入</p>
                </div>

                <div class="navBox">
                    <div class="iconfont icon-maichu" style='color: #de6233'></div>
                    <p>卖出</p>
                </div>

                <div class="navBox">
                    <div class="iconfont icon-chedanshenpi" style='color: #de6233'></div>
                    <p>撤单</p>
                </div>

                <div class="navBox">
                    <div class="iconfont icon-shiliangzhinengduixiang1" style='color: #ec5b00'></div>
                    <p>资金持仓</p>
                </div>

                <div class="navBox">
                    <div class="iconfont icon-chengjiaodingdan" style='color: #f48d0a'></div>
                    <p>委托成交</p>
                </div>

                <div class="navBox">
                    <div class="iconfont  icon-shengou" style='color: #f48d0a'></div>
                    <p>新股申购</p>
                </div>
                <!-- <p>今日无新股发行</p>-->

                <div class="navBox">
                    <div class="iconfont  icon-weibiaoti5" style='color: #f48d0a'></div>
                    <p>银证转账</p>
                </div>

                <div class="navBox">
                    <div class="iconfont icon-gengduo-2" style='color: #f48d0a'></div>
                    <p>更多</p>
                </div>

            </div>
            <!--交易功能-->
            <div class="tranFun ">
                <div class="title">交易功能</div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-rongzirongquan01" style="color:#ef9e45"></div><div>融资融券</div></div>
                    <div class="right">两融开户、交易</div>
                </div>

                <div class="item">
                    <div class="left"><div class="iconfont icon-ganggutong01" style="color:#ef9e45"></div><div>港股通</div></div>
                    <div class="right">港股L2行情免费看</div>
                </div>

            </div>
            <!-- 理财助手-->
            <div class="finaAss ">
                <div class="title">理财助手</div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-licai" style="color:#f7c775"></div><div>理财产品</div></div>
                    <div class="right">保本固定收益</div>
                </div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-zijinlicai" style="color:#f7c775"></div><div>天天宝</div></div>
                    <div class="right">年化收益3~6%</div>
                </div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-guozhainihuigou" style="color:#f7c775"></div><div>国债逆回购</div></div>
                    <div class="right">182天期 2.81%</div>
                </div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-caifu111" style="color:#f7c775"></div><div>财富贷</div></div>
                    <div class="right">合约还款</div>
                </div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-xinzhaishengou" style="color:#f7c775"></div><div>新债申购</div></div>
                    <div class="right">今日无新债发行</div>
                </div>
            </div>
            <!--特色服务-->
            <div class="speSer ">
                <div class="title">特色服务</div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-72-copy" style="color:#ee323b"></div><div>账户分析</div></div>
                    <div class="right">盈亏一目了然</div>
                </div>
            </div>
            <!--  更多交易-->
            <div class="moreTran ">
                <div class="title">更多交易</div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-meiyuanqian" style="color:#389df0"></div><div>港美交易</div></div>
                    <div class="right">全球资产配置</div>
                </div>
                <div class="item">
                    <div class="left"><div class="iconfont icon-haofangtuo400iconfontershoufangchengjiao" style="color:#389df0"></div><div>基金交易</div></div>
                    <div class="right">基金费率1折起</div>
                </div>
            </div>
            <!--底部导航-->
            <div class="bottomNav">
                <div class="bottomBox " ><div class="iconfont icon-fuwurexian1"></div><p>服务热线</p></div>
                <div class="bottomBox " ><div class="iconfont icon-kefu"></div><p>在线客服</p></div>
                <div class="bottomBox " ><div class="iconfont icon-bangzhuzhongxin"></div><p>帮助中心</p></div>
                <div class="bottomBox " ><div class="iconfont icon-yijianfankui"></div><p>在线反馈</p></div>
            </div>
        </div>
        <!--底部-->
        <div class='foot '></div>
    </div>
</template>

<script>
    export default {
        name: "transaction",
    }
</script>

<style scoped>

</style>